<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8">
		<meta http-equiv="X-UA-Compatible" content="IE=edge">
		<title>魏远商城</title>
		<meta name="viewport" content="initial-scale=1, maximum-scale=1">
		<link rel="shortcut icon" href="/favicon.ico">
		<meta name="apple-mobile-web-app-capable" content="yes">
		<meta name="apple-mobile-web-app-status-bar-style" content="black">
		<link rel="stylesheet" href="css/style.css" />
		<style type="text/css">
			.mui-toast-container {
				text-align: center;
				position: fixed;
				z-index: 9999;
				bottom: 50px;
				width: 100%;
				-webkit-transition: opacity .8s;
				transition: opacity .8s;
				opacity: 1
			}
			
			.mui-toast-container {
				display: none
			}
		</style>
	</head>

	<body style="background: #eaeef1;">
		<div class="header">
			<h1 style="font-size: 17px;font-weight: 500;">找回密码</h1>
			<li class="register-back mui-action-back"><img src="img/back-le.png" alt="" height="50%" onclick="history.back(-1)" /></li>
		</div>
		<!--<div class="header">
			<h1>找回密码</h1>
			<li class="register-back mui-action-back"><img src="img/back-le.png" alt="" height="50%" onclick="history.back(-1)" /></li>
		</div>-->

		<p class="register-content">——————&nbsp;&nbsp;&nbsp;手机号快速找回密码&nbsp;&nbsp;&nbsp;——————</p>
		<div class="register-phone">
			<input type="text" maxlength="11" id="register-phone-input" class="register-phone-input" placeholder="请输入你的手机号" />
			<input type="button" class="code" id="code" value="获取验证码" />
		</div>
		<input type="text" id="register-code" maxlength="6" class="register-code" placeholder="请输入验证码" />
		<input type="password" class="register-password" maxlength="30" placeholder="请输入6-30位数字/英文的密码" />
		<input type="password" class="register-password-again" maxlength="30" placeholder="请再次输入密码" />
		<div id="resiter-submit" class="resiter-submit">提交</div>
		<div class="mui-toast-container" id="mui-toast-container">
			<div class="mui-toast-message"></div>
		</div>
		<script src="js/jquery-3.1.1.min.js" type="text/javascript" charset="utf-8"></script>
		<script src="js/mui.min.js"></script>
		<script src="js/url.js" type="text/javascript" charset="utf-8"></script>
		<script type="text/javascript">
			var mima = /^[A-Za-z0-9]+$/;
			var hm = /^1[34578]\d{9}$/;
			//获取验证码时间	
			var wait = 59;
			var $code = $("#code");
			var timer;

			function time() {
				if(wait == 0) {
					$code.attr("disabled", false);
					//	$code.value = "获取验证码";
					$code.val("获取验证码");
					wait = 59;
					$('#code').css('background-color', '#e9af29')
					clearInterval(timer);
				} else { // www.jbxue.com
					$code.attr("disabled", true);
					$code.css('background-color', '#c7c2c2');
					$code.val(wait + " s后可重发");
					//$code.value = wait + "s后可重发";
					wait--;

				}
			}

			function pd() {
				$('#mui-toast-container').css('display', 'inline-block')
				//				$('.mui-toast-message').html('请检查您输入的手机号码);
				setTimeout(function() {
					$('#mui-toast-container').css('display', 'none')
				}, 1000)
			}
			//			    手机号码获取验证码
			$('#code').on('tap', function() {
				var phone = $('.register-phone-input').val();
				if(!hm.test(phone)) {
					pd();
					$('.mui-toast-message').html('手机号码不正确，请重新输入');
					//					mui.toast('请检查您输入的手机号码');
					console.log(phone);
					return;
				} else {
					codejk();

				}
				//      手机号码获取验证码接口
				function codejk() {
					$.ajax({
						url: ur + '/mobilemember/frontmember/getPhoneVerifyCode',
						type: 'post',
						dataType: 'json',
						data: {
							'memberVO.phone': phone,
							'type': 'forget-password',
							'data': ''
						},
						success: function(data) {
							console.log(JSON.stringify(data) + '短信')
							var n = data.result.meta.code;
							if(n == '200') {
								console.log('>>>>手机号码获取验证码');
								timer = setInterval(function() {
									time();
								}, 1000)
								pd();
								$('.mui-toast-message').html('已经发送验证码，请注意查收');
								//								mui.toast('已经发送验证码，请注意查收')
							} else if(n == '204') {
								pd();
								$('.mui-toast-message').html('该手机号码未注册，请先注册');
								//								mui.toast('该手机号码未注册，请先注册')
							} else {
								pd();
								$('.mui-toast-message').html('请检查您输入的手机号码');
								console.log('>>>>手机号码获取验证码失败');
								//								mui.toast('请检查您输入的手机号码')
							}
						},
						error: function(e) {
							pd();
							$('.mui-toast-message').html('请检查您的网络...');
							console.log(JSON.stringify(e) + '错误');
							//							mui.toast('请检查您的网络...')
						}
					})
				}
			})
			//			$('#code').on('tap', function() {
			//					timer = setInterval(function() {
			//							time();
			//					},1000)
			//				})
			//		密码和验证码
			$('#resiter-submit').on('tap', function() {
				var phone = $('.register-phone-input').val();
				var code = $('.register-code').val();
				var password1 = $('.register-password').val();
				var password2 = $('.register-password-again').val();
				if(phone == '') {
					pd();
					$('.mui-toast-message').html('手机号码不能为空，请重新输入');
					//					mui.toast('请检查您输入的手机号码');
				} else if(code == '') {
					pd();
					$('.mui-toast-message').html('验证码不能为空，请重新输入');
					//					mui.toast('请检查您输入的验证码');
					return;
				} else if(password1 == '' || password2 == '') {
					pd();
					$('.mui-toast-message').html('密码不能为空，请重新输入');
					//					mui.toast('新密码不能为空');
					return;
				}else if(password1.length < 6||password2.length<6){
					pd();
					$('.mui-toast-message').html('请输入不小于6位的密码');
				} else if(!mima.test(password1)) {
					pd();
					$('.mui-toast-message').html('请输入6-30位数字/英文的密码');
					//					mui.toast('请输入6-30位数字/英文的密码');
					return;
				} else if(password1 != password2) {
					pd();
					$('.mui-toast-message').html('两次密码不一致，请重新输入');
					//					mui.toast('两次密码不一致，请重新输入');
					return;
				} else {
					password();
				}
				//		密码和验证码接口
				function password() {
					$.ajax({
						type: "post",
						url: ur + "/mobilemember/frontmember/getPassword",
						dataType: 'json',
						data: {
							'memberVO.password': password1,
							'phoneCode': code,
							'memberVO.phone': phone
						},
						success: function(data) {
//							alert(JSON.stringify(data) + ">>>")
							console.log(JSON.stringify(data) + '找回密码成功tiaozhuang')
							if(data.result.meta.code == "200") {
								mui.toast('找回密码成功');
								mui.back();
							} else if(data.result.meta.code == "204") {
								pd();
								$('.mui-toast-message').html('手机号码有误,请重新填写');
								//								mui.toast('手机号码有误,请重新填写')
							} else if(data.result.meta.code == "201") {
								pd();
								$('.mui-toast-message').html('验证码输入不正确,请检查');
								//								mui.toast('验证码输入不正确')
							} else {
								pd();
								$('.mui-toast-message').html('请检查您输入的信息');
								//								mui.toast('请检查您输入的信息')
							}
						},
						error: function(e) {
							pd();
							$('.mui-toast-message').html('请检查您的网络...');
							console.log(e + '登录失败')
							//							mui.toast('请检查您的网络...')
						}
					});
				}

			})
		</script>
	</body>

</html>